<script type="text/javascript" language="javascript" charset="utf-8">
	function babySearch(){
		var word = document.getElementById('word').value;
		
		if (!isEmpty(word))
		    Translate(word);		
    }
    
    function Translate(word_to_search){
        var lang = getLanguage();
        var word = word_to_search;
        var rbox = document.getElementById('result');
        
        var xhr = new XMLHttpRequest();
        xhr.open("GET", "http://info.babylon.com/cgi-bin/bis.fcgi?rt=ol&tid=BabylonSearch&mr=1&tl="+lang+"&term="+word, true);        
        xhr.onreadystatechange = function() {
          if (xhr.readyState == 4) {
            rbox.innerHTML = xhr.responseText;
          }
        }
        
        xhr.send();
    }

	// Return the default language.
	function getLanguage(){
		var language = localStorage["language"];
		
		if (!language)
            return 'es';

		return language;
	}
	
	// Validation of 
	function isEmpty(aTextField){
	    var empty = false;
        var re = /\s/g; 
        var str = aTextField.replace(re, "");        
        
        if (str.length == 0) {
           empty = true;
        } 
        
        return empty;
    }
    
    // Show |url| in a new tab.
    function showUrl(url) {
      // Only allow http and https URLs.
      if (url.indexOf("http:") != 0 && url.indexOf("https:") != 0) 
        return;
      
      chrome.tabs.create({url: url});
    }
    
    // Set the focus on textbox-
    function init(){
        document.frmsearch.word.focus();
    }
</script>    
<link rel="stylesheet" type="text/css" href="format.css">
<body onload="init();">
    <div id="wrapper" style="width:280px;">
        <div id="searchbox" >
            <form name="frmsearch" action="" onSubmit="babySearch()">
                <input id="word" name="word" type="text" />
                <button id="define" name="define" onClick="babySearch()">Define</button>
            </form>                
        </div>
        <div id="result" class="result">
        </div>
        <div id="footer">
            <p>
                If you can't see the Babylon translation box, use this link for <a href="http://translation.babylon.com" onClick="showUrl(this.href); return false;">Translation</a> 
                or this one for <a href="http://dictionary.babylon.com" onClick="showUrl(this.href); return false;">Dictionary</a>
            </p>
            <p class="copy">&copy; 2010, Powered by <a href="http://www.babylon.com" onClick="showUrl(this.href); return false;">Babylon Translator</a></p>
        </div>
    </div>
</body>
